<template>
<div style="margin: 10px; height: 100%">
    <vue-event-calendar style="height:95%;" :events="todoList" @monthChanged="" @dayChanged=""></vue-event-calendar>
</div>
</template>

<script>
import Cookies from 'js-cookie'

export default {
    data() {
        return {
            todoList: []
        }
    },
    methods: {
        monthChange(month) {
            console.log(month)
        },
        dayChange(day) {
            console.log(day)
        }
    },
    mounted() {
        if (Cookies.get('dataList') === undefined) {
            return;
        }
        var dataList = new Map(eval(Cookies.get('dataList')))
        console.log(dataList);
        var currentTodoList = [];
        dataList.forEach(function(value, key, map) {
            for (var i = 0; i < value.length; i++) {
                var currentTodo = {
                    title: value[i].title,
                    desc: value[i].desc,
                    date: key.split('-').join('/')
                };
                currentTodoList.push(currentTodo);
            }
        });
        this.todoList = currentTodoList;
    }
}
</script>
